const projectDown = document.querySelector(".project-down");
const taskList = document.querySelector(".task-list ul li:nth-child(2)");
const box = document.querySelectorAll(".box");
projectDown.addEventListener("click", function (e) {
  if (e.target.tagName === "LI") {
    const old = document.querySelector(".projectActive");
    old && old.classList.remove("projectActive");
    e.target.classList.add("projectActive");
    console.dir(e.target);
    let key = e.target.innerHTML;
    switch (key) {
      case "任务":
        location.href = "./ylc.html";

        break;
      case "文件":
        location.href = "./ylcwenjian.html";

        break;
      case "概览":
        location.href = "./ylcgailan.html";

        break;
      case "统计":
        break;

      default:
        break;
    }
  }
});
taskList.addEventListener("click", function (e) {
  if (
    e.target.tagName === "SPAN" ||
    e.target.tagName === "EM" ||
    e.target.tagName === "I"
  ) {
    const old = document.querySelector(".taskActive");
    old && old.classList.remove("taskActive");
    e.target.classList.add("taskActive");
  }
});
box.forEach(function (el, i) {
  el.addEventListener("click", function () {
    console.log(111);
  });
});

// 文件管理的交互
const btnAll = document.querySelector(".btnAll");
const onbtn = document.querySelectorAll("#onbtn");
let kaiguan = true;
const addFolder = document.querySelector(".addFolder");
const cuangjian = document.querySelector(".cuangjian");
addFolder.addEventListener("click", function () {
  cuangjian.innerHTML = `
  <ul>
                  <li>
                    <button class="onbtn" id="onbtn"></button>
                  </li>
                  <li>
                    <img
                      src="https://img.axureshop.com/f2/fb/cd/f2fbcd26e8434d5488d3ef239ea2f821/images/文件管理/u3204.svg"
                      alt=""
                    />
                    <span><input type="text" placeholder="请输入说明" ></span>
                  </li>
                  <li></li>
                  <li>weiwei</li>
                  <li>2023-05-29</li>
                  <li class="xiugai">
                    <button>重命名</button> |
                    <button>下载</button>
                  </li>
                </ul>`;
});

btnAll.onclick = () => {
  if (kaiguan) {
    kaiguan = false;
    btnAll.src = "./images/true.png";
    onbtn.forEach((el) => {
      el.className = "onbtnActive";
    });
  } else {
    kaiguan = true;
    btnAll.src = "./images/false.png";
    onbtn.forEach((el) => {
      el.className = "onbtn";
    });
  }
};

onbtn.forEach((el) => {
  el.addEventListener("click", function () {
    if (el.className === "onbtn") {
      el.className = "onbtnActive";
    } else {
      el.className = "onbtn";
    }
    for (let i = 0; i < onbtn.length; i++) {
      if (document.querySelector(".onbtnActive")) {
        btnAll.src = "./images/false.png";
      }
      if (!document.querySelector(".onbtn")) {
        btnAll.src = "./images/true.png";
      }
    }
  });
});
